export default class Mark {
  //-----使用层-----
  /**
   * 现在的使用逻辑还是太繁琐了：先要使用marker去把字符串编译成H5
   * 再调用dealWith传入父级文件夹的名字进行转换，最后呢，使用completeBody把标题整出来
   * @param {*} str
   */
  //-----工具层-----
  // 前面的都可以作为一种迭代的笔记去看待了
  // 最终体
  completeBody(str) {
    const regex = /<h(\d+) id="([^"]+)">(.+?)<\/h\1>\n/g
    let match
    const hArray = []
    while ((match = regex.exec(str)) !== null) {
      const level = match[1]
      const id = match[2]
      const title = match[3]
      hArray.push({ level, id, title })
    }
    return hArray
  }

  // img处理，要处理成自定义的
  dealWith(str, fatherFile = '') {
    // 图片要做一个什么处理？
    // 笔记文件上传的时候，被要求确定一个文件夹
    // 这个文件夹会和所有的图片进行连接，所以文件夹的名字需要http获取到这里进行拼接
    // linux网络存储位置+父级文件夹名+文件名
    const regex = /<img src="(.+?)" alt="(.+?)">/g
    const ims = /(?<=\/)[^/]+$/g
    const http = 'http://zengzhi.info:82/images/'
    const replaced = str.replace(regex, (match, p1, p2) => {
      const newSrc = p1.match(ims)[0] // 拿到文件名.png
      return `<img src="${http + fatherFile + '/' + newSrc}" alt="${p2}">`
    })
    return replaced // 这是最终处理后的要被渲染的md结构
  }

  // 处理标题，添加一个外边距的类名
  addExtraClass(str, className = '') {
    const regex = /<h(\d+) id="([^"]+)">(.+?)<\/h\1>\n/g
    const replaced = str.replace(regex, (match, p1, p2, p3) => {
      return `<h${p1} id="${p2}" class="${className}">${p3}</h${p1}>`
    })
    return replaced
  }
}
